import 'package:flutter/material.dart';
import '/components/page/common.dart';
import '/components/actions/more.dart';
import '/components/custom/bottom_sheet.dart';
import '../../widgets/service_top.dart';
import '../../widgets/service_group.dart';

class ServiceGroup {
  final String group;
  final List<ServiceItem> childrenList;

  ServiceGroup({
    required this.group,
    required this.childrenList
  });
}

// 我的 - 服务
class ServicePage extends StatelessWidget {
  final String title;
  const ServicePage({
    super.key,
    required this.title,
  });

  @override
  Widget build(BuildContext context) {

    const padding = 8.0; // 边距

    List<ServiceGroup> mockData = [
      ServiceGroup(
        group: '金融理财',
        childrenList: [
          ServiceItem(
            name: '信用卡还款',
            imgUrl: 'assets/images/service/信用卡还款.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '我的银行卡',
            imgUrl: 'assets/images/service/保险服务.png',
            route: 'EmptyPage',
          )
        ]
      ),
      ServiceGroup(
          group: '生活服务',
          childrenList: [
            ServiceItem(
              name: '手机充值',
              imgUrl: 'assets/images/service/手机充值.png',
              route: 'EmptyPage',
            ),
            ServiceItem(
              name: '生活缴费',
              imgUrl: 'assets/images/service/生活缴费.png',
              route: 'EmptyPage',
            ),
            ServiceItem(
              name: '城市服务',
              imgUrl: 'assets/images/service/城市服务.png',
              route: 'EmptyPage',
            ),
            ServiceItem(
              name: '腾讯公益',
              imgUrl: 'assets/images/service/腾讯公益.png',
              route: 'EmptyPage',
            ),
            ServiceItem(
              name: '医疗健康',
              imgUrl: 'assets/images/service/医疗健康.png',
              route: 'EmptyPage',
            )
          ]
      ),
      ServiceGroup(
        group: '交通出行',
        childrenList: [
          ServiceItem(
            name: '出行服务',
            imgUrl: 'assets/images/service/出行服务.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '火车票机票',
            imgUrl: 'assets/images/service/火车票机票.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '滴滴出行',
            imgUrl:'assets/images/service/滴滴出行.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '酒店民宿',
            imgUrl: 'assets/images/service/酒店民宿.png',
            route: 'EmptyPage',
          ),
        ]
      ),
      ServiceGroup(
        group: '购物消费',
        childrenList: [
          ServiceItem(
            name: '品牌发现',
            imgUrl: 'assets/images/service/品牌发现.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '京东购物',
            imgUrl: 'assets/images/service/京东购物.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '美团外卖',
            imgUrl: 'assets/images/service/美团外卖.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '电影演出玩乐',
            imgUrl: 'assets/images/service/电影演出玩乐.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '美团特价',
            imgUrl: 'assets/images/service/美团特价.png',
            route: 'EmptyPage',
          ),
          ServiceItem(
            name: '拼多多',
            imgUrl: 'assets/images/service/拼多多.png',
            route: 'EmptyPage',
          )
        ]
      ),
    ];

    return CommonPage(
      title: title,
      actions: [
        MoreAction(
          onPressed: () {
            final List<BottomSheetItem> mockData = [
              BottomSheetItem(
                  child: const Text('服务管理'),
                  onTap: () {
                    debugPrint('服务管理');
                  }
              ),
            ];

            showMyBottomSheet(context, mockData);
          },
        )
      ],
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: padding),
        child: SingleChildScrollView(
          child: Column(
            children: [
              const ServiceTopWidget(),
              ...mockData.map((group) => ServiceGroupWidget(
                padding: padding,
                group: group.group,
                childrenList: group.childrenList
              )),
              const SizedBox(height: 40)
            ],
          ),
        ),
      ),
    );
  }
}
